<template>
  <view class="container">

    <uni-nav-bar dark :fixed="true" shadow background-color="#f8f8f8" color="#303133" font-size="18px" status-bar left-icon="left" left-text="返回"
                 title="桃源AI助手-任务内容" @clickLeft="back" />

    <view class="example">
      <uni-forms ref="form" :model="user" labelWidth="80px">
        <uni-forms-item label="任务内容" name="nickName">
          <view style="margin-top: 15rpx;font-size: 35rpx;font-weight: bold;">{{task.taskMemo}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="task.roomName!=''" label="群名称" name="nickName" :label-style="{fontSize: '14rpx'}">
          <view class="small-font" style="margin-top: 15rpx">{{task.roomName}}</view>
        </uni-forms-item>
        <uni-forms-item label="消息时间" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{parseTime(task.msgtime, '{y}-{m}-{d} {h}:{i}:{s}')}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="false" label="行动项" name="phonenumber">
          <view class="small-font" v-html="(task.taskDetail)"></view>
        </uni-forms-item>
        <uni-forms-item v-if="false" label="任务类型" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{task.taskActions}}</view>
        </uni-forms-item>

        <uni-forms-item :label="quest1" v-if="task.taskProblem!='无'&&task.taskProblem!=''&&task.taskProblem!= null&&task.taskProblem!='[]'" name="email">
          <view class="small-font" style="margin-top: 15rpx" v-html="task.taskProblem"></view>
        </uni-forms-item>
        <uni-forms-item :label="quest2" v-if="task.taskResult!='无'&&task.taskResult!=''&&task.taskResult!= null&&task.taskResult!='[]'" name="email">
          <view class="small-font" style="margin-top: 15rpx" v-html="task.taskResult"></view>
        </uni-forms-item>
        <uni-forms-item :label="quest3" v-if="task.taskSolution!='无'&&task.taskSolution!=''&&task.taskSolution!= null&&task.taskSolution!='[]'" name="email">
          <view class="small-font" style="margin-top: 15rpx" v-html="task.taskSolution"></view>
        </uni-forms-item>


        <uni-forms-item v-if="task.taskDate!='无'&&task.taskDate!=''" label="任务日期" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{task.taskDate}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskTime!='无'&&task.taskTime!=''" label="任务时间" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{task.taskTime}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskUserlist!='无'&&task.taskUserlist!=''" label="关系人" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{task.taskUserlist}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskKeyword!=null && task.taskKeyword.length > 0" label="关键词" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{task.taskKeyword}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskAddress!='无'&&task.taskAddress!=''" label="地点" name="email">
          <view class="small-font" style="margin-top: 15rpx">{{task.taskAddress}}</view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskTargets!='无'&&task.taskTargets!=''" label="数据指标" name="email">
          <view class="small-font" v-html="(task.taskTargets)"></view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskTerms!='无'&&task.taskTerms!=''" label="专业术语" name="email">
          <view class="small-font" v-html="(task.taskTerms)"></view>
        </uni-forms-item>
        <uni-forms-item v-if="task.taskRes!='无'&&task.taskRes!=''"  label="涉及资源" name="email">
          <view class="small-font" v-html="(task.taskRes)"></view>
        </uni-forms-item>
        <uni-forms-item label="附件" name="email">
          <view  class="small-font" >暂未开放</view>
        </uni-forms-item>
        <uni-forms-item label="原文" name="email">
          <view class="small-font" style="margin-top: 15rpx" v-html="replaceNewline(task.orignalContent)"></view>
        </uni-forms-item>
      </uni-forms>
      <!--
      <button type="primary" v-if="false" style="background-color: #333333" @click="toggle('left')">修订</button>
      <button type="primary" v-if="false" style="background-color: #333333;margin-top: 15rpx;" @click="submit">完成</button>
      <button type="primary" v-if="false" style="background-color: #ff0000;margin-top: 15rpx;" @click="taskDel">删除</button>


      <button type="primary" v-if="false" style="background-color: #4874CB;margin-top: 15rpx;" @click="todo">转待办事项</button>
      -->

      <button @click="toggle('center')" style="margin-top: 20rpx;background-color: #4874CB;color: white;" type="primary">转为待办事项</button>
      <button @click="todo" style="margin-top: 20rpx;background-color: #4874CB;color: white;" type="primary">转发（同事）</button>
      <button type="primary" v-if="!showMoreBtn" style="background-color: #3cc51f;margin-top: 15rpx;" @click="showMoreBtn=true">更多</button>

      <button v-if="showMoreBtn" type="primary" style="background-color: #4874CB;margin-top: 15rpx;" @click="toggle333('left')">查看原文</button>
      <button v-if="showMoreBtn" @click="taskAddQYWXSchedule" style="margin-top: 20rpx;background-color: #4874CB;color: white;" type="primary">转为日程</button>
      <button v-if="showMoreBtn" @click="todo" style="margin-top: 20rpx;background-color: #4874CB;color: white;" type="primary">转为闹钟</button>
      <button v-if="showMoreBtn" @click="todo" style="margin-top: 20rpx;background-color: #4874CB;color: white;" type="primary">预定会议</button>
      <button v-if="showMoreBtn" @click="showMoreBtn=false" style="margin-top: 20rpx;background-color: gray;color: white;" type="primary">关闭</button>


    </view>


    <!-- 普通弹窗 -->
    <uni-popup ref="popup" background-color="#fff" >
      <view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">

        <view class="example">
          <uni-forms ref="form" :modelValue="todoAI" labelWidth="80px">
            <uni-forms-item label="待办事项" name="todoMemo">
              <uni-easyinput type="textarea" v-model="todoAI.todoMemo" placeholder="请输入内容" />
            </uni-forms-item>
            <uni-forms-item label="关系人" name="todoUserlist">
              <uni-easyinput v-model="todoAI.todoUserlist" placeholder="请输入内容" />
            </uni-forms-item>
            <uni-forms-item label="提醒我" name="todoAlertDate">
              <view>功能开发中</view>
            </uni-forms-item>
          </uni-forms>
          <view style="display: flex;color: black;width: 90%;margin-top: 25rpx;">
            <view style="margin-right: 25rpx;"><image @click="handleTodoCheck()" v-if="todoCheck==1" src="/static/images/checkbox-1.png" style="width: 40rpx;height: 40rpx;margin-left: 15rpx;"></image>
              <image @click="handleTodoCheck()" v-if="todoCheck==0" src="/static/images/checkbox-2.png" style="width: 40rpx;height: 40rpx;margin-left: 15rpx;"></image>
            </view>
            <view>关联原会话内容</view>
          </view>
          <button type="primary" style="background-color: #4874CB;margin-top: 15rpx;" @click="todoSave">保存</button>
          <button style="margin-top: 15rpx;" @click="$refs.popup.close"><text>关闭</text></button>

        </view>
      </view>
    </uni-popup>

    <!-- 普通弹窗 -->
    <uni-popup ref="popup222" background-color="#fff">
      <view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">

        <view class="content_list">
        <scroll-view scroll-y="true" class="scroll_view_style">
          <button v-if="false" @click="closeDrawer('showLeft')"><text class="word-btn-white">关闭</text></button>
          <view class="example">
            <uni-forms ref="form" :model="task" labelWidth="80px">
              <uni-forms-item label="任务内容" name="taskMemo">
                <uni-easyinput v-model="task.taskMemo" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="行动项" name="taskDetail">
                <uni-easyinput v-model="task.taskDetail" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="任务类型" name="taskActions">
                <uni-easyinput v-model="task.taskActions" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="任务日期" name="taskDate">
                <uni-easyinput v-model="task.taskDate" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="任务时间" name="taskTime">
                <uni-easyinput v-model="task.taskTime" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item v-if="false" label="消息时间" name="msgtime">
                <view style="margin-top: 15rpx">{{parseTime(task.msgtime, '{y}-{m}-{d} {h}:{i}:{s}')}}</view>
              </uni-forms-item>
              <uni-forms-item label="关系人" name="taskUserlist">
                <uni-easyinput v-model="task.taskUserlist" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="关键词" name="taskKeyword">
                <uni-easyinput v-model="task.taskKeyword" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="地点" name="taskAddress">
                <uni-easyinput v-model="task.taskAddress" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="数据指标" name="email">
                <uni-easyinput v-model="task.taskTargets" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="专业术语" name="email">
                <uni-easyinput v-model="task.taskTerms" placeholder="请输入内容" />
              </uni-forms-item>
              <uni-forms-item label="涉及资源" name="email">
                <uni-easyinput v-model="task.taskRes" placeholder="请输入内容" />
              </uni-forms-item>
            </uni-forms>
            <button type="primary" style="background-color: #3cc51f;margin-top: 15rpx;" @click="taskSave">保存</button>

          </view>
        </scroll-view>
        </view>
      </view>
    </uni-popup>

    <uni-popup ref="popup333" background-color="#fff">
      <view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">

        <view class="content_list">
          <scroll-view scroll-y="true" class="scroll_view_style">
            <button v-if="false" @click="closeDrawer('showLeft')"><text class="word-btn-white">关闭</text></button>
            <view class="example">
              <view style="margin-top: 15rpx" v-html="replaceNewline(task.orignalMsg)"></view>
              <button type="primary" style="background-color: #4874CB;margin-top: 15rpx;" @click="$refs.popup333.close()">关闭</button>

            </view>
          </scroll-view>
        </view>
      </view>
    </uni-popup>

    <uni-drawer ref="showLeft" mode="left" :width="320" :draggable="true">
    </uni-drawer>
  </view>
</template>

<script>
  import { getUserProfile, taskDetail, taskEdit, taskDel, taskAddQYWXSchedule, questList,todoAdd } from "@/api/system/user"
  import { updateUserProfile } from "@/api/system/user"

  export default {
    data() {
      return {
        quest1: '问题1结论',
        quest2: '问题2结论',
        quest3: '问题3结论',
        type: 'center',
        msgType: 'success',
        messageText: '这是一条成功提示',
        value: '',
        showRight: false,
        showLeft: false,
        showMoreBtn: false,
        task:{},
        taskOwner: '',
        groupId: '',
        id: 0,
        checked: true,
        user: {
          nickName: "",
          phonenumber: "",
          email: "",
          sex: ""
        },
        sexs: [{
          text: '男',
          value: "0"
        }, {
          text: '女',
          value: "1"
        }],
        rules: {
          nickName: {
            rules: [{
              required: true,
              errorMessage: '用户昵称不能为空'
            }]
          },
          phonenumber: {
            rules: [{
              required: true,
              errorMessage: '手机号码不能为空'
            }, {
              pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
              errorMessage: '请输入正确的手机号码'
            }]
          },
          email: {
            rules: [{
              required: true,
              errorMessage: '邮箱地址不能为空'
            }, {
              format: 'email',
              errorMessage: '请输入正确的邮箱地址'
            }]
          }
        },
        nowDate: '',
        todoAI: {},
        todoMemo: '',
        // 表单数据
        formData: {
          todoMemo: '',
          todoUserlist: ''
        },
        todoCheck: 1,
      }
    },
    onLoad() {
      const query = this.$route.query;
      console.log(query); // 输出URL参数对象
      this.taskOwner = query.taskOwner;
      this.groupId = query.groupId;
      this.id = query.id;
      this.getAITaskInfo()
    },
    onReady() {
      //this.$refs.form.setRules(this.rules)
    },
    methods: {
      todoSave(){
        if(this.todoCheck==1){
          //this.todoAI.orignalMsg = this.task.orignalMsg;
          this.todoAI.orignalTaskid = this.task.id;
        }
        this.todoAI.todoOwner = this.taskOwner;
        todoAdd(this.todoAI).then(response => {
          this.$modal.msgSuccess("保存成功")
          this.$refs.popup.close();
        })
      },
      handleTodoCheck(){
        if(this.todoCheck == 1){
          this.todoCheck = 0;
        } else{
          this.todoCheck = 1;
        }
      },
      toggle(type) {
        this.todoAI = this.task;
        this.todoAI.todoMemo = this.task.taskMemo;
        this.todoAI.todoUserlist = this.task.taskUserlist;

        this.type = type
        // open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
        this.$refs.popup.open(type)
      },
      taskAddQYWXSchedule(e) {
        taskAddQYWXSchedule(this.task).then(response => {
          this.$modal.msgSuccess("企业微信日程创建成功");
        })
      },
      taskDel(e) {
        let that = this;
        uni.showModal({
          title: '提示',
          content: '您确定要删除这个待办吗？',
          success: function (res) {
            if (res.confirm) {
              console.log('用户点击确定');
              taskDel(that.task.id).then(response => {
                that.$modal.msgSuccess("删除成功");
                setTimeout( () => {
                  // 这里添加您的逻辑
                  that.back()
                }, 1500)
              })

            } else if (res.cancel) {
              console.log('用户点击取消');
            }
          }
        });

      },
      toggle333(type) {
        this.type = type
        // open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
        this.$refs.popup333.open(type)
      },
      // 打开窗口
      showDrawer(e) {
        this.$refs[e].open()
      },
      // 关闭窗口
      closeDrawer(e) {
        this.$refs[e].close()
      },
      todo(){
        this.$modal.msgSuccess("即将上线...")
      },
      back(){
        //this.$tab.navigateTo(`/pages/ai/list?taskOwner=${this.taskOwner}&groupId=${this.groupId}&id=${this.id}`)
        uni.navigateBack();
      },
      getUser() {
        getUserProfile().then(response => {
          this.user = response.data
        })
      },
      taskSave(ref) {
        taskEdit(this.task).then(response => {
          this.$modal.msgSuccess("修改成功")
          this.$refs.popup.close();
        })
      },
      submit(ref) {
        this.$refs.form.validate().then(res => {
          updateUserProfile(this.user).then(response => {
            this.$modal.msgSuccess("修改成功")
          })
        })
      },
      getAITaskInfo() {
        taskDetail(this.id).then(response => {
          this.task = response.data
          this.task.taskDetail = this.splitAct(this.task.taskDetail)
          this.task.taskTargets = this.splitAct(this.task.taskTargets)
          this.task.taskTerms = this.splitAct(this.task.taskTerms)
          this.task.taskRes = this.splitAct(this.task.taskRes)

          this.task.taskProblem = this.splitAct(this.task.taskProblem)
          this.task.taskResult = this.splitAct(this.task.taskResult)
          this.task.taskSolution = this.splitAct(this.task.taskSolution)


          console.log(this.task)

          let that = this;
          //开始获取 quest
          questList().then(qres => {
            console.log(qres.rows);
            let qList = qres.rows;
            for(var i=0;i<qList.length;i++){
              if(that.task.taskActions == qList[i].questType){
                that.quest1 = qList[i].title1;
                that.quest2 = qList[i].title2;
                that.quest3 = qList[i].title3;
              }
            }

          })

        })
      },
      replaceNewline(str){
        if(str==null) return str;
        var reg=new RegExp("\n","g");
        str= str.replace(reg,"<br>");
        return str;
      },
      splitAct(actions){
        if(actions==null){
          return "";
        }

        var str = "";
        //var jsonObj = JSON.parse("[\"1. 先不要进行更新。\",\"2. 下周一白天一起更新。\",\"3. 以后尽可能在白天进行更新。\"]");
        try{
          var jsonObj = JSON.parse(actions);
          //var jsonObj = JSON.parse("[{\"行动项\":\"王昊Will进行测试\"}]");

          console.log(jsonObj)
          for (const obj in jsonObj) {

            if(typeof jsonObj[obj] === "object"){
              try{
                var tmpJson = jsonObj[obj];
                for (let key in tmpJson) {
                  str = str+"◆"+tmpJson[key]+"<br>";
                }
              }catch (e) {
                console.log(e);
                str = str+"◆"+jsonObj[obj]+"<br>";
              }
            }else{
              str = str+"◆"+jsonObj[obj]+"<br>";
            }
          }
        }catch (e) {
          str = actions;
        }

        return str;
      },
      parseTime(time, pattern) {
        if (arguments.length === 0 || !time) {
          return null
        }
        const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
        let date
        if (typeof time === 'object') {
          date = time
        } else {
          if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
            time = parseInt(time)
          } else if (typeof time === 'string') {
            time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
          }
          if ((typeof time === 'number') && (time.toString().length === 10)) {
            time = time * 1000
          }
          date = new Date(time)
        }
        const formatObj = {
          y: date.getFullYear(),
          m: date.getMonth() + 1,
          d: date.getDate(),
          h: date.getHours(),
          i: date.getMinutes(),
          s: date.getSeconds(),
          a: date.getDay()
        }
        const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
          let value = formatObj[key]
          // Note: getDay() returns 0 on Sunday
          if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
          if (result.length > 0 && value < 10) {
            value = '0' + value
          }
          return value || 0
        })
        return time_str
      }
    }
  }
</script>

<style lang="scss">
  page {
    background-color: #ffffff;
  }

  .example {
    padding: 15px;
    background-color: #fff;
  }

  .segmented-control {
    margin-bottom: 15px;
  }

  .button-group {
    margin-top: 15px;
    display: flex;
    justify-content: space-around;
  }

  .form-item {
    display: flex;
    align-items: center;
    flex: 1;
  }

  .button {
    display: flex;
    align-items: center;
    height: 35px;
    line-height: 35px;
    margin-left: 10px;
  }


  @mixin flex {
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex-direction: row;
  }

  @mixin height {
    /* #ifndef APP-NVUE */
    height: 100%;
    /* #endif */
    /* #ifdef APP-NVUE */
    flex: 1;
    /* #endif */
  }

  .box {
    @include flex;
  }

  .button {
    @include flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    height: 35px;
    margin: 0 5px;
    border-radius: 5px;
  }

  .example-body {
    background-color: #fff;
    padding: 10px 0;
  }

  .button-text {
    color: #fff;
    font-size: 12px;
  }

  .popup-content {
    @include flex;
    align-items: center;
    justify-content: center;
    padding: 15px;
    height: 50px;
    background-color: #fff;
    width: 105%;
    height: 900rpx;
  }

  .popup-height {
    @include height;
    width: 600rpx;
  }

  .text {
    font-size: 12px;
    color: #333;
  }

  .popup-success {
    color: #fff;
    background-color: #e1f3d8;
  }

  .popup-warn {
    color: #fff;
    background-color: #faecd8;
  }

  .popup-error {
    color: #fff;
    background-color: #fde2e2;
  }

  .popup-info {
    color: #fff;
    background-color: #f2f6fc;
  }

  .success-text {
    color: #09bb07;
  }

  .warn-text {
    color: #e6a23c;
  }

  .error-text {
    color: #f56c6c;
  }

  .info-text {
    color: #909399;
  }

  .dialog,
  .share {
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex-direction: column;
  }

  .dialog-box {
    padding: 10px;
  }

  .dialog .button,
  .share .button {
    /* #ifndef APP-NVUE */
    width: 100%;
    /* #endif */
    margin: 0;
    margin-top: 10px;
    padding: 3px 0;
    flex: 1;
  }

  .dialog-text {
    font-size: 14px;
    color: #333;
  }

  .content_list {
    height: 1200rpx;
    overflow-x: hidden;
    .scroll_view_style{
      height: 100%;
    }
  }

  .small-font {
    font-size: 24rpx;
  }
</style>
